<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    
</body>
<script>
    
    // 单个实例，一个对象，如果需要创建多个对象，每次创建需重新设置属性或方法，哪怕每个对象的属性都是相同的
    // const p1 = {
    //     color:"白色",
    //     brand:"P50",
    //     size:"7"
    // }
    // const p2 = {
    //     color:"白色",
    //     brand:"P50",
    //     size:"7"
    // }
    // const p3 = {
    //     color:"黑色",
    //     brand:"P50",
    //     size:"7"
    // }


    // 封装


    // function createPhone(c, b, s){
    //     // 原料
    //     const obj = {};
    //     // 加工
    //     obj.color = c;
    //     obj.brand = b;
    //     obj.size = s;
    //     // 出厂
    //     return obj;
    // }

    // const p1 = createPhone("白色", "小米", "7");
    // const p2 = createPhone("黑色", "HUAWEI", "6");
    // const p3 = createPhone("红色", "锤子", "8");
    // const p4 = createPhone();

    // console.log(p1);
    // console.log(p2);
    // console.log(p3);
    // console.log(p4);


    // 以上自定义工厂的写法被废弃...
    // js内置了工厂模式


    // 构造内置函数
    // new Object()
    // 构造自定义函数
    // new 自定义函数()

    // new关键字的原理：
        // 1. 立即创建一个新对象，存放在内存中
        // 2. 改变原函数的this指向，指向自己创建的新对象
        // 3. 
        // 4. 执行原函数的所有代码
        // 5. 检测原函数是否主动返回对象，如果没有，自动返回自己创建的新对象

    function fn(c, s){
        // console.log(this)
        // 加工
        this.color = c;
        this.size = s;
    }

    const f1 = fn()
    console.log(f1);

    const f2 = new fn("白色",7);
    console.log(f2);

    const f3 = new fn("黑色",8);
    console.log(f3);

</script>
</html>